<script setup>

import {loginApi,getQrcode} from "@/api/login.js";
import {onMounted, onUnmounted, ref} from "vue";
import {qrcodeStatus} from "@/api/qrcode/moni.js";
import {message} from "ant-design-vue";

const imgUrl = ref("");
function doLogin() {
  loginApi().then((res) => {
   });
}

function getQrcodeurl() {

}

let intervalFlush //定时器

onMounted(() => {
  getQrcode().then((res) => {
    window.localStorage.setItem("sense", res.data.fileName);
    imgUrl.value = res.data.url;

  });
  intervalQuery(intervalFlush);
});


const intervalQuery = () => {
  clearInterval(intervalFlush)
  intervalFlush = setInterval(() => {
    // 此处你要轮巡的接口
    qrcodeStatus(null).then(res => {
      console.log(res);
      if (res.code === 200) {
        clearInterval(intervalFlush);
        message.info("扫码成功");
        // 跳转页面
        window.location.href = "/";
      }
    });
  }, 1000)
};

onUnmounted(() => {
  // 离开页面销毁定时器

  clearInterval(intervalFlush)
});


</script>

<template>
  <a-button @click="doLogin"> 登录</a-button>
  <a-button @click="getQrcodeurl"> 获取二维码</a-button>


   <img :src="imgUrl">

</template>

<style scoped>

</style>
